<template>
    <div class="SSZ">
        <header>
            <van-nav-bar
            title="我的鉴定"
            left-arrow
            />
            <van-tabs v-model="active">
            <van-tab title="图片鉴定" class="Smada1">
                <van-nav-bar title="马切达工作室" class="Sgzs">
            <van-icon name="arrow" slot="right" />
            </van-nav-bar>

            <van-grid :column-num="3" class="Sjst">
            <van-grid-item
                v-for="value in 3"
                :key="value"
                icon="photo-o"
            />
            </van-grid>
            <p>正在鉴定中</p>
            <van-nav-bar title="马切达工作室" class="Sgzs">
            <van-icon name="arrow" slot="right" />
            </van-nav-bar>

            <van-grid :column-num="3" class="Sjst">
            <van-grid-item
                v-for="value in 3"
                :key="value"
                icon="photo-o"
            />
            </van-grid>
            <p>鉴定完成</p>
            </van-tab>

            <van-tab title="实物鉴定" class="Sma1">
                 <div class="SDN1">
                    <div class="SDN"></div>
                    <h3>大牛</h3>
                    <h4>10-23 18:00</h4>
                 </div>
                <van-grid :column-num="3" class="Sjst">
                <van-grid-item
                    v-for="value in 3"
                    :key="value"
                    icon="photo-o"
                />
                </van-grid>
                <p>正在鉴定中</p>
                <div class="SDN1">
                    <div class="SDN"></div>
                    <h3>大牛</h3>
                    <h4>10-23 18:00</h4>
                 </div>
                <van-grid :column-num="3" class="Sjst">
                <van-grid-item
                    v-for="value in 3"
                    :key="value"
                    icon="photo-o"
                />
                </van-grid>
                <p>鉴定完成</p>

                </van-tab>
            </van-tabs>
            
        </header>

        <section>
             
            
        </section>

        <footer>
            
        </footer>
    </div>
</template>

<script>
export default {
  data() {
    return {
      checked: '',
      active:0
    };
  },
  methods:{
      
  }

}

</script>


<style scoped>
*{
    margin: 0;
    padding: 0;
}
.SSZ{
    display: flex;
    height: 100vh;
    flex-direction: column;
    font-size: 0.12rem;
}

header,footer{
    height:0.8rem; 
}
section{
    flex:1;
    overflow:auto;
}
.Sgzs{
    text-align: left;
    margin:0;
}
.Sjst{
    margin-top: 0.6rem;
}
p{
    display: block;
    text-align: center;
    margin-top: 1.5rem;
    font-size: 0.3rem
}
.SDN1{
    margin-top: 0.3rem;
}
.SDN{
    width: 1rem;
    height: 1rem;
    border: 1px solid #000;
    border-radius: 50%;
    float: left;
}
h3{
    font-size: 0.4rem;
}
h4{
    font-size: 0.2rem;
}
.Sgzs .van-icon-arrow:before{
    font-size: 0.2rem;
    margin-left: -5rem;
}
.Sgzs .van-nav-bar__title{
    float: left;
    font-size: 0.2rem;
    color: #B0ACAC;
}


</style>


